<!DOCTYPE html>
<html lang="en">

<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js" type="text/javascript"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js" integrity="sha384-alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ"
        crossorigin="anonymous"></script>
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb"
        crossorigin="anonymous">
    <script type="text/javascript">




        var getDate = function (y, q) {
            var edate = "";
            var sdate = "";
            if (q == 1) {
                sdate = y + "-01-01"
                edate = y + "-03-31"
            }
            if (q == 2) {
                sdate = y + "-04-01"
                edate = y + "-06-30"
            }
            if (q == 3) {
                sdate = y + "-07-01"
                edate = y + "-09-30"
            }
            if (q == 4) {
                sdate = y + "-10-01"
                edate = y + "-12-31"
            }
            return [sdate, edate];
        };

        var url = window.location.href;
        var arrayUrl = url.split('=');
        var ou = arrayUrl[3];
        var arrayUrl1 = arrayUrl[2].split('&');
        var pe = arrayUrl1[0];
        var year = pe.split('Q')[0];
        var quarter = pe.split('Q')[1];
        var prog_id = "VCuHIFtJJSv";
        var dates = getDate(year, quarter);
        var startdate = dates[0];
        var enddate = dates[1];
        var htnDbActive = 0, htnDbTotal = 0;
        var totalExit = 0, totalActive = 0;
        var cerHtnDb12Total = 0, htnDbSeenTotal = 0;
        var checkStatus = function (data) {
            data.enrollments.forEach(function (element, index) {
                var tei = element.trackedEntityInstance;
                var active = false;
                var exit = false;
                var htndbnum = false;
                var htnanddbflag = false;
                var cer12flag = false;
                var htnDbSeenflag = false;
                $.when(
                    $.getJSON("../api/events.json?orgUnit=" + ou + "&program=" + prog_id + "&programStage=Kr60c8j7vMe&trackedEntityInstance=" + tei + "&skipPaging=true", {
                        format: "json"
                    }),
                    $.getJSON("../api/events.json?orgUnit=" + ou + "&program=" + prog_id + "&trackedEntityInstance=" + tei + "&orderBy=eventDate:DESC&skipPaging=true", {
                        format: "json"
                    })

                ).then(function (data1, data2) {
                    var exitstage = data1[0].events;
                    var eventsdata = data2[0].events;
                    if (exitstage.length == 0) {
                        active = true;
                    }
                    else {
                        var date = exitstage[0].eventDate;
                        var first = date.split('T')[0];
                        var expireDate = new Date(first);
                        if (new Date(startdate) <= expireDate) {
                            active = true;
                        }
                        else if (new Date(enddate) <= expireDate && expireDate >= new Date(startdate)) {
                            exit = true;
                            // active = false;
                        }
                        else {
                            //active = false;
                        }
                    }

                    if (active) {
                        var flag = 0;
                        if (eventsdata[0].programStage == "Kr60c8j7vMe") { var p = 1 }
                        else { var p = 0; }

                        for (var i = p; i < eventsdata.length; i++) {
                            var date = eventsdata[i].eventDate;
                            var first = date.split('T')[0];
                            var expireDate = new Date(first);
                            if (new Date(enddate) >= expireDate) {
                                var currentEventAttr = eventsdata[i].dataValues;
                                for (var j = 0; j < currentEventAttr.length; j++) {
                                    if ((currentEventAttr[j].dataElement == "Ft37n3yO81y" || currentEventAttr[j].dataElement == "D4Z6XYfNQR9" || currentEventAttr[j].dataElement == "nwFajZjl3Fa" || currentEventAttr[j].dataElement == "uoVoakOJULl") && (currentEventAttr[j].value == "Newly_diagnosed" || currentEventAttr[j].value == "Previously_diagnosed")) {
                                        htnanddbflag = true;
                                        //flag = i;
                                        for (var k = 0; k < currentEventAttr.length; k++) {
                                            if ((currentEventAttr[k].dataElement == "xs1fYqkRLW7" || currentEventAttr[k].dataElement == "Jo9Q7zgmtt1" || currentEventAttr[k].dataElement == "TEP4nLvGj4d" || currentEventAttr[k].dataElement == "KGc70Z8QdL2" || currentEventAttr[k].dataElement == "nMYJ8iizuMT" || currentEventAttr[k].dataElement == "ZfAWkRlF6an") && (currentEventAttr[k].value == "true" || currentEventAttr[k].value == "stroke" || currentEventAttr[k].value == "tia")) {
                                                htndbnum = true;
                                            }
                                        }
                                    }
                                }
                            }
                            if (new Date(enddate) >= expireDate && expireDate >= new Date(startdate)) {
                                var currentEventAttr = eventsdata[i].dataValues;
                                //console.log(first);
                                for (var j = 0; j < currentEventAttr.length; j++) {
                                    if ((currentEventAttr[j].dataElement == "Ft37n3yO81y" || currentEventAttr[j].dataElement == "D4Z6XYfNQR9" || currentEventAttr[j].dataElement == "nwFajZjl3Fa" || currentEventAttr[j].dataElement == "uoVoakOJULl" || currentEventAttr[j].dataElement == "rwDJebu16Fu" || currentEventAttr[j].dataElement == "lzBg6QalyhT") && (currentEventAttr[j].value == "Newly_diagnosed" || currentEventAttr[j].value == "Previously_diagnosed")) {
                                        htnDbSeenflag = true;
                                    }
                                }
                            }


                            if (htnDbSeenflag) {
                                var dateTwelveMonthsAgo = new Date(enddate);
                                dateTwelveMonthsAgo.setFullYear(dateTwelveMonthsAgo.getFullYear() - 1);
                                dateTwelveMonthsAgo.setDate(dateTwelveMonthsAgo.getDate() - 1);
                                if (new Date(enddate) >= expireDate && expireDate > dateTwelveMonthsAgo) {
                                    for (var k = 0; k < currentEventAttr.length; k++) {
                                        if (currentEventAttr[k].dataElement == "bxZbTKBLYGL" || currentEventAttr[k].dataElement == "KEVxrQoxfJ9") {
                                            cer12flag = true;
                                        }
                                    }
                                }
                            }

                        }

                    }


                    if (exit) { totalExit++; }
                    if (htnanddbflag) { totalActive++; }
                    if (htndbnum) { htnDbTotal++; }
                    if (cer12flag) { cerHtnDb12Total++; }
                    if (htnDbSeenflag) { htnDbSeenTotal++; }
                    htnDbActive = totalExit + totalActive;
                    document.getElementById('num').innerHTML = htnDbTotal;
                    document.getElementById('deno').innerHTML = htnDbActive;
                    document.getElementById('num2').innerHTML = cerHtnDb12Total;
                    document.getElementById('deno2').innerHTML = htnDbSeenTotal;
                    document.getElementById('p').innerHTML = index + " of " + (data.enrollments.length - 1) + " completed";
                    if (data.enrollments.length - 1 == index) {
                        document.getElementById('loader').style.display = "none";
                    }
                });

            });

        };


        $(document).ready(function () {

            $.when(
                $.getJSON("../api/enrollments.json?ou=" + ou + "&ouMode=DESCENDANTS&program=" + prog_id + "&fields=trackedEntityInstance&skipPaging=true&programEndDate=" + enddate, {
                    format: "json"
                })
            ).then(function (data1) {
                checkStatus(data1);


            });
        });
    </script>
    <style>
        table {
            table-layout: fixed;
            word-wrap: break-word;
            text-align: center;
        }

        /* Absolute Center Spinner */

        .loading {
            position: fixed;
            z-index: 999;
            height: 2em;
            width: 2em;
            overflow: show;
            margin: auto;
            top: 0;
            left: 0;
            bottom: 0;
            right: 0;
        }

        /* Transparent Overlay */

        .loading:before {
            content: '';
            display: block;
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.3);
        }

        /* :not(:required) hides these rules from IE9 and below */

        .loading:not(:required) {
            /* hide "loading..." text */
            font: 0/0 a;
            color: transparent;
            text-shadow: none;
            background-color: transparent;
            border: 0;
        }

        .loading:not(:required):after {
            content: '';
            display: block;
            font-size: 10px;
            width: 1em;
            height: 1em;
            margin-top: -0.5em;
            -webkit-animation: spinner 1500ms infinite linear;
            -moz-animation: spinner 1500ms infinite linear;
            -ms-animation: spinner 1500ms infinite linear;
            -o-animation: spinner 1500ms infinite linear;
            animation: spinner 1500ms infinite linear;
            border-radius: 0.5em;
            -webkit-box-shadow: rgba(0, 0, 0, 0.75) 1.5em 0 0 0, rgba(0, 0, 0, 0.75) 1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) 0 1.5em 0 0, rgba(0, 0, 0, 0.75) -1.1em 1.1em 0 0, rgba(0, 0, 0, 0.5) -1.5em 0 0 0, rgba(0, 0, 0, 0.5) -1.1em -1.1em 0 0, rgba(0, 0, 0, 0.75) 0 -1.5em 0 0, rgba(0, 0, 0, 0.75) 1.1em -1.1em 0 0;
            box-shadow: rgba(0, 0, 0, 0.75) 1.5em 0 0 0, rgba(0, 0, 0, 0.75) 1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) 0 1.5em 0 0, rgba(0, 0, 0, 0.75) -1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) -1.5em 0 0 0, rgba(0, 0, 0, 0.75) -1.1em -1.1em 0 0, rgba(0, 0, 0, 0.75) 0 -1.5em 0 0, rgba(0, 0, 0, 0.75) 1.1em -1.1em 0 0;
        }

        /* Animation */

        @-webkit-keyframes spinner {
            0% {
                -webkit-transform: rotate(0deg);
                -moz-transform: rotate(0deg);
                -ms-transform: rotate(0deg);
                -o-transform: rotate(0deg);
                transform: rotate(0deg);
            }
            100% {
                -webkit-transform: rotate(360deg);
                -moz-transform: rotate(360deg);
                -ms-transform: rotate(360deg);
                -o-transform: rotate(360deg);
                transform: rotate(360deg);
            }
        }

        @-moz-keyframes spinner {
            0% {
                -webkit-transform: rotate(0deg);
                -moz-transform: rotate(0deg);
                -ms-transform: rotate(0deg);
                -o-transform: rotate(0deg);
                transform: rotate(0deg);
            }
            100% {
                -webkit-transform: rotate(360deg);
                -moz-transform: rotate(360deg);
                -ms-transform: rotate(360deg);
                -o-transform: rotate(360deg);
                transform: rotate(360deg);
            }
        }

        @-o-keyframes spinner {
            0% {
                -webkit-transform: rotate(0deg);
                -moz-transform: rotate(0deg);
                -ms-transform: rotate(0deg);
                -o-transform: rotate(0deg);
                transform: rotate(0deg);
            }
            100% {
                -webkit-transform: rotate(360deg);
                -moz-transform: rotate(360deg);
                -ms-transform: rotate(360deg);
                -o-transform: rotate(360deg);
                transform: rotate(360deg);
            }
        }

        @keyframes spinner {
            0% {
                -webkit-transform: rotate(0deg);
                -moz-transform: rotate(0deg);
                -ms-transform: rotate(0deg);
                -o-transform: rotate(0deg);
                transform: rotate(0deg);
            }
            100% {
                -webkit-transform: rotate(360deg);
                -moz-transform: rotate(360deg);
                -ms-transform: rotate(360deg);
                -o-transform: rotate(360deg);
                transform: rotate(360deg);
            }
        }

        button {
            cursor: pointer;
        }
    </style>

    <body>
        <div class="loading" id="loader">Loading&#8230;</div>

        <br> ̰
        <table class="table table-bordered table-hover reporttable">
            <thead>
                <tr>
                    <td style="width:50%">HTN or/and DB (Assesments true/stroke/tia)</td>
                    <td style="width:50%" id="num"></td>
                </tr>
                <tr>
                    <td style="width:50%">Active patients + exit patients durin rp (HTN and DB)</td>
                    <td style="width:50%" id="deno"></td>
                </tr>
                <tr>
                    <td style="width:50%">Creatnine in past 12 months</td>
                    <td style="width:50%" id="num2"></td>
                </tr>
                <tr>
                    <td style="width:50%">HTN and DB active patients seen in reporting period</td>
                    <td style="width:50%" id="deno2"></td>
                </tr>
                <tr>
                    <td colspan="2"></td>
                </tr>
                <tr>
                    <td style="width:50%">progress</td>
                    <td style="width:50%" id="p"></td>
                </tr>
            </thead>
        </table>
    </body>

</html>